<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <script src="src/Itcast.core.js"></script>
        <script src="src/Itcast.dom.js"></script>
        <style>
        .container {
            width: 200px;
            height: 300px;
            border: 1px dashed blue;
        }
        .box {
            width: 100px;
            height: 50px;
            border: 1px solid red;
            margin: 20px auto;
        }
    </style>
    <script>
         //实例办法 appendTo
         /*Itcast.fn.appendTo=function(dom){
         	//现在this中是多少个DOM元素
         	//for(var i=0;i<this.length;i++){
         	//     dom.appendChild(this[i]);
         	//}
         	
         	//这里的this是伪数组
         	return this.each(function(){
         		//这里的this是伪数组中的而每一个dom元素
         		dom.appendChild(this);
         	});
         }*/
         //我们现在讨论左边为单个dom元素与多个dom元素的情况
         //哪一个更加具有普遍性
         
         Itcast.fn.appendTo=function(dom){
            // for(var i=0;i<this.length;i++){
            //     dom.appendChild(this[i]);
            // }

            //这里的this是伪数组
            return this.each(function(){
                //这里的this是伪数组中的而每一个dom元素
                dom.appendChild(this);
            });
         }
    </script>
    </head>
    <body>
    <div class="container"></div>
    </body>
    <script>
          I( '<div class="box"></div><div class="box"></div><div class="box"></div>' ).appendTo( document.getElementsByClassName( 'container' )[ 0 ] )
          I( '<div class="box">' ).appendTo( document.getElementsByClassName( 'container' )[ 0 ] )
    </script>
</html>